<!doctype html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script src="js/jquery-2.1.4.min.js"></script>
    <script src="js/katex.min.js"></script>
    <script src="js/auto-render.min.js"></script>
    <script src="js/marked.js"></script>
    <script src="js/highlight.pack.js"></script>
    <script src="js/preview.js"></script>

    <link rel="stylesheet" href="css/github.css"/>
    <link rel="stylesheet" href="css/katex.min.css"/>
    <link rel="stylesheet" href="css/bootstrap.css"/>
    <style type="text/css">
        img {
            width:100%
            }
    </style>
</head>
<body>
<div class="container" id="preview"></div>
<script>
    function scrollToLine(line) {
        const el = document.querySelector(`.line[data-line="${line}"]`);
        if (el) {
          el.scrollIntoView({ behavior: 'smooth', block: 'center' });
        }
    }
    function bindImageClick() {
          document.querySelectorAll('.image').forEach(img => {
            img.style.cursor = 'pointer';
            img.addEventListener('click', () => {
              const src = img.getAttribute('src');
              if (window.AndroidInterface && src) {
                window.AndroidInterface.openImageFullScreen(src);
              }
            });
          });
        }

        function bindFavoriteClick() {
          document.querySelectorAll('.favorite a').forEach(aTag => {
            aTag.addEventListener('click', function (e) {
              e.preventDefault();
              const url = new URL(aTag.href);
              const md5 = url.searchParams.get("md5");
              const pos = url.searchParams.get("pos");
              if (window.Android && window.Android.onFavoriteClick) {
                window.Android.onFavoriteClick(md5, pos);
              }
            });
          });
        }

        document.addEventListener('DOMContentLoaded', function () {
          bindImageClick();
          bindFavoriteClick();
    });
</script>

</body>
</html>
